/*
 *软件 */
import React from 'react';
import { Row, Col, Tag, Popover } from 'antd';
import { genID } from '@/utils/utils';
import styles from '../../index.less';
import Card from '../../../components/Card';
import SoftTable from '../../../components/SoftTable';

const SoftwarePreinstall = ({ selected, tableData }) => (
    <div>
        {selected?.length > 0 ? (
            selected?.map((item, index) => (
                <Card
                    type="inner"
                    title={item.choiceType === 0 ? '新员工自选' : '部门推荐'}
                    style={{ marginBottom: '20px' }}
                    key={genID(10)}
                >
                    <Row>
                        <Col>
                            <ul className={styles.materialList}>
                                {index === 0 ? (
                                    <li>
                                        <span>通用软件：</span>
                                        <span>由IT人员统一安装至新员工的电脑中</span>
                                        <Popover
                                            content={<SoftTable data={tableData} />}
                                            trigger="hover"
                                            getPopupContainer={triggerNode => triggerNode.parentElement}
                                            placement="top"
                                        >
                                            <a style={{ marginLeft: '10px' }}>查看软件</a>
                                        </Popover>
                                    </li>
                                ) : null}
                                <>
                                    <li>
                                        <span>专业软件：</span>
                                        <span>
                                            {item?.professionalList?.map(subItem => (
                                                <Tag key={genID(10)}>{subItem}</Tag>
                                            ))}
                                        </span>
                                    </li>
                                    <li>
                                        <span>更多软件：</span>
                                        <span>
                                            {item?.moreSoftwareList?.map(subItem => (
                                                <Tag key={genID(10)}>{subItem}</Tag>
                                            ))}
                                        </span>
                                    </li>
                                </>
                            </ul>
                        </Col>
                    </Row>
                </Card>
            ))
        ) : (
            <Card type="inner" title="新员工自选" style={{ marginBottom: '20px' }} key={genID(10)}>
                <Row>
                    <Col>
                        <ul className={styles.materialList}>
                            <li>
                                <span>通用软件：</span>
                                <span>由IT人员统一安装至新员工的电脑中</span>
                                <Popover
                                    content={<SoftTable data={tableData} />}
                                    trigger="hover"
                                    getPopupContainer={triggerNode => triggerNode.parentElement}
                                    placement="top"
                                >
                                    <a style={{ marginLeft: '10px' }}>查看软件</a>
                                </Popover>
                            </li>
                        </ul>
                    </Col>
                </Row>
            </Card>
        )}
    </div>
);

export default SoftwarePreinstall;
